<template>
	<div>
		<div class="kk" style="width: 100%;height: 200px;"></div>
		<div style="width: 400px;margin-left: calc(50% - 200px);">
			<div>员工账号:
				<el-input v-model="user.userid" clearable></el-input>
			</div>
			<div style="margin-top: 20px;">员工密码:
				<el-input v-model="user.userpwd" clearable></el-input>
			</div>
			<div style="margin-top: 20px;">员工姓名:
				<el-input v-model="user.username" clearable></el-input>
			</div>
			<div class="con" style="width: 320px; height: 50px;margin-left:calc(50% - 160px);margin-top: 30px;">
				<div class="zi" style="width: 100px; height: 100%; float: left; line-height: 50px;">
					员工身份：
				</div>
				<div class="kuang" style="width: 210px; height: 100%; float: left; line-height: 50px;">
					<template>
						<el-select v-model="value" placeholder="请选择">
							<el-option label="服务人员" value="1"></el-option>
							<el-option label="后厨人员" value="2"></el-option>
						</el-select>
					</template>
				</div>
			</div>
			<div style="text-align: center;margin-top: 20px;">
				<el-button @click='addstaff' type="danger">提交</el-button>
			</div>
		</div>
	</div>
</template>

<script>
	export default{
		data(){
			return {
				user:{userid:'',userpwd:'',username:''},
				value:''
			}
		},
		methods:{
			addstaff:function(){
				if(this.value==1)
				{
					//服务人员
					let wuser={wid:this.user.userid,wpwd:this.user.userpwd,wname:this.user.username};
					this.$http.post('http://localhost:8080/OrderSystemServer/order/user/waiteradd',wuser)
					.then((response)=>{
						if(response.data.isOK)
						{
							this.$message({
									type: 'success',
									message: '添加成功'
								});
						}
						else{
							this.$message({
									type: 'error',
									message: '添加失败，可能是账号已被占用'
								});
						}
					});
				}else if(this.value==2){
					//后厨人员
					let cuser={cid:this.user.userid,cpwd:this.user.userpwd,cname:this.user.username};
					this.$http.post('http://localhost:8080/OrderSystemServer/order/user/cookeradd',cuser)
					.then((response)=>{
						if(response.data.isOK)
						{
							this.$message({
									type: 'success',
									message: '添加成功'
								});
						}
						else{
							this.$message({
									type: 'error',
									message: '添加失败，可能是账号已被占用'
								});
						}
					});
				}
				else{
					this.$message({
									type: 'error',
									message: '请先选择员工类型'
								});
				}
			}
		}
	}
</script>

<style>

</style>